import {str2num} from '@/libs/toolkit'
import {defineComponent, ref, watch} from 'vue'
import {CnNormalSpan} from '../text'

export const TargetWeight = defineComponent({
  props: {
    value: Number,
    showUnit: {
      type: Boolean,
      default: true
    },
    disabled: Boolean,
    placeholder: {
      type: String,
      default: '输入分数'
    }
  },
  emits: {
    'update:value': (data: number | undefined): boolean => true
  },
  setup(props, {emit}) {
    let weight = ref<number | null>(null)

    watch(
      () => props.value,
      n => {
        weight.value = n !== undefined ? n.toString() : ''
      },
      {immediate: true}
    )

    watch(
      () => weight.value,
      n => {
        // let num = str2num(n)
        // if (num > 120) {
        //   num = 120
        // }
        // console.log('num', num)

        emit('update:value', n)
      }
    )

    const targetWInputChange = e => {
      console.log(e)
    }

    return () => (
      <div class='flex items-center gap-x-4'>
        {/* <a-input
          
         
          type='number'
         
          
          max={120}
          onChange={targetWInputChange}
        ></a-input> */}
        <a-input-number
          class='rounded-4 flex-1'
          v-model={[weight.value, 'value']}
          min={1}
          max={125}
          step={1}
          placeholder={props.placeholder}
          disabled={props.disabled || false}
        />
        {props.showUnit ? <CnNormalSpan class='text-12'>%</CnNormalSpan> : null}
      </div>
    )
  }
})
